<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<html>
<head>
    <title>Title</title>

    <!-- 该页面使用的主题样式文件 -->
    <link rel="stylesheet" type="text/css"
          href="/static/plugins/easyui/themes/bootstrap/easyui.css">
    <!-- 图标样式文件 -->
    <link rel="stylesheet" type="text/css"
          href="/static/plugins/easyui/themes/icon.css">
    <!-- jquery核心库 -->
    <script type="text/javascript" src="/static/plugins/easyui/jquery.min.js"></script>
    <!-- easyui核心文件 -->
    <script type="text/javascript" src="/static/plugins/easyui/jquery.easyui.min.js"></script>
    <!-- 引入国际化文件 -->
    <script type="text/javascript" src="/static/plugins/easyui/locale/easyui-lang-zh_CN.js"></script>

    <script src="/static/js/spendClassify.js"></script>
</head>
<body>
<table id="spend_classify_datagrid"  class="easyui-datagrid"></table>
<%--图标的样式--%>
<link rel="stylesheet" href="/static/css/spendPoint.css">



<div id="spend_toolbar">
    <a  href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add'" data-cmd="add">新增</a>
    <a  href="#" class="easyui-linkbutton" data-options="iconCls:'icon-reload'" data-cmd="reload">刷新</a>
</div>

<%--button--%>
<%--增加父分类btn按钮--%>
<div id="spendBtn">
    <a class="easyui-linkbutton" iconCls="icon-add" data-options="plain:true" data-cmd="saved"/>保存</a>
    <a class="easyui-linkbutton" iconCls="icon-edit" data-options="plain:true"  data-cmd="cancel">取消</a>
</div>
<%--增加子分类btn按钮--%>
<div id="spendChildBtn">
    <a class="easyui-linkbutton" iconCls="icon-add" data-options="plain:true" data-cmd="savedChild"/>保存</a>
    <a class="easyui-linkbutton" iconCls="icon-edit" data-options="plain:true"  data-cmd="cancelChlid">取消</a>
</div>


<%--新增父分类弹出窗口--%>
<div id="add_dialog" class="easyui-dialog" data-options="title:'新增分类',iconCls:'icon-myedit'">
    <!--创建表单-->
    <form id="spend_form" method="post">
        <input type="hidden" name="id">
        <table align="center" style="margin-top: 20px">
            <tr><h2 align="center">输入分类</h2></tr>
            <tr>
                <td>支出分类:</td>
                <td>
                    <input type="text" class="easyui-textbox" name="text" data-options="required:true"
                           style="padding-left:10px;width: 175px;">
                </td>
            </tr>
        </table>

    </form>
</div>


<%--新增子分类弹出窗口--%>
<div id="addpp_dialog" class="easyui-dialog" data-options="title:'新增子分类',iconCls:'icon-myedit'">
    <!--创建表单-->
    <form id="spendChild_form" method="post">
        <input type="hidden" name="id">
        <table align="center" style="margin-top: 20px">
            <tr><h2 align="center">输入子分类</h2></tr>
            <tr>
                <td>支出子分类:</td>
                <td>
                    <input type="text" class="easyui-textbox" name="text" data-options="required:true"
                           style="padding-left:10px;width: 175px;">
                    <input id="parent_id" type="hidden" name="parentId">
                </td>
            </tr>
        </table>

    </form>
</div>



<table id="spendpoint" class="t_spendpoint" align="left">
    <c:forEach items="${spendRootClassify}" var="spendR">
        <tr>
            <%--父分类--%>
            <td>
                <div class="parentpoint" style="color:orange;width: 170px;"><a>${spendR.text}</a>
                    <a class="i" plain="true" onclick="delete1(this)" id="${spendR.id}">☠</a>
                </div>
                <td>
                    <div class="point" style="width:10px; height: 20px; background:none;border: none;">
                        <a class="i" id="${spendR.id}" onclick="addpp(this)" style="color: #00B83F">＋</a>
                    </div>
                </td>
            </td>

            <c:forEach items="${spendR.children}" var="spendC">
                <%--子分类--%>
                <td>
                    <div class="cildrenpoint">

                        <div class="point"><a>${spendC.text}</a>
                            <a class="i" plain="true" onclick="delete1(this)" id="${spendC.id}">☠</a>
                        </div>


                        <div class="point" style="width:10px; height: 20px; background:none;border: none;">
                            <a class="i" id="${spendR.id}" onclick="addpp(this)" style="color: #00B83F">＋</a>
                        </div>
                    </div>
                </td>
            </c:forEach>



        </tr>
    </c:forEach>



</table>



</body>
</html>

